<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			/* 
			所有图片横向布局			10'
			图片之间的间隔为16px 		10'
			第一张图片的左边距为0 	10'
			最后一张图片的右边距为0 	10'
			*/
			body {
				background-color: cornsilk;
				width: 1200px;
				margin: 0 auto;
			}

			body>img {
				width: 100%;
			}

			.content {
				border: 1px solid red;
				height: 174px;
			}

			.content ul{
				padding: 0px;
				margin: 0px;
			}
			/* 使用flex布局   */
			.content li{
				display: inline-block;
				margin: 17px 16px;
				width: 115px;
				/* flex-direction: row-reverse; */
				justify-content: space-between;
				/* align-items: center; */
			}
			.content ul li:first-child{
				margin-left: 0px;
			}
			.content ul li:last-child{
				margin-right: 0px;
			}
			/* 在这里填写css代码 */
		</style>
	</head>
	<body>
		<img src="img/res.png">
		<div class="content">
			<!-- 在这里填写html代码 -->
			<ul>
				<li><img src="img/toplist_a01.jpg" ></li>
				<li><img src="img/toplist_a02.jpg" ></li>
				<li><img src="img/toplist_a03.jpg" ></li>
				<li><img src="img/toplist_a04.jpg" ></li>
				<li><img src="img/toplist_a05.jpg" ></li>
				<li><img src="img/toplist_a06.jpg" ></li>
				<li><img src="img/toplist_a07.jpg" ></li>
				<li><img src="img/toplist_a08.jpg" ></li>
			</ul>
		</div>
	</body>
</html>
